<template>
  <div>
    <button :class="type" @click="registershings">{{title}}</button>
  </div>
</template>

<script>
export default {
  data () {
    return {
      message: {
        default: '普通提示框',
        primary: '主要提示框',
        success: '成功提示框',
        warning: '警告提示'
      }
    }
  },
  props: {
    title: String,
    type: {
      type: String,
      default: 'default'
    }
  },
  methods: {
    registershings () {
      this.$emit('click', this.message[this.type])
    }
  }
}
</script>

<style>
  .primary {
    background-color: blue;
  }
  .success{
    background-color: green;
  }
  .warning {
    background-color: red;
  }
</style>
